import {
  createRouterMiddleware,
} from './middleware'
import {
  locationChangeAction
} from './actions'
import { createRouterReducer } from './reducer'
import {
  push, // 返回一个跳转路径的 action 动作对象
} from './actions'

// 从 state 总状态中获取 router ( 与合并 reducer 处理函数时定死的 ) 分状态
const selectRouterState = state => state.router

export function createReduxHistoryContext({history}) {
  const routerMiddleware = createRouterMiddleware(history) // 基于 history 创建一个中间件
  const routerReducer = createRouterReducer(history) // 基于 history 返回一个 reducer
  function createReduxHistory(store) { // 基于仓库返回一个 redux 版本的 history
    // 初始化先派发一次 将路径信息保存到 store 中
    console.log(location, history.action)
    store.dispatch(locationChangeAction(location, history.action))

    // 当路径发生变化时自动执行回调函数
    history.listen((location, action) => {
      // 派发动作 将最新的路径信息保存到 store 中
      store.dispatch(locationChangeAction(location, action))
    })
    return { // redux 版本的 history 对象 里面有些属性是重写原来的 history 对象中的属性
      createHref: history.createHref, // 使用 history.createHref 方法
      push: (...args) => store.dispach(push(...args)), // 改写原来的 history.push('/counter')
      listen: history.listen,
      get location() { // 重写原来的 history.location
        return selectRouterState(store.getState()).location
      },
      get action() { // 重写原来的 history.action
        return selectRouterState(store.getState()).action
      },

    };
  }
  return {
    routerMiddleware, // redux 中间件 基于 action 跳转路径
    createReduxHistory, // 返回一个 redux 版本的 history
    routerReducer, // reducer 处理器 处理路径变化
  }
}

